import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:icooker/model/reommend_data.dart';
import 'package:cached_network_image/cached_network_image.dart';
import 'package:icooker/pages/webview/webview.dart';
import 'package:kasax/kasax.dart';

/// 渠道
class ChannelList extends StatelessWidget {
  final List<Channel> dataList;

  const ChannelList(this.dataList, {Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    var itemWidth = ScreenUtil().screenWidth - 8 / 4;
    return GridView.builder(
      shrinkWrap: true,
      physics: NeverScrollableScrollPhysics(),
      gridDelegate:
          SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 4),
      itemBuilder: (context, index) {
        var channel = dataList[index];
        return InkWell(
          onTap: () {
            /// 跳转到webview
            /// 使用 ModalRoute.of(context)!.settings.arguments;接收参数
            RouteUtils.pushNameWithArgs(context, '/webview',
                {'url': "https://flutter.cn/", 'title': channel.title});
          },
          child: Expanded(
            // width: itemWidth,
            // height: itemWidth * 0.8,
            child: Stack(
              children: [
                AspectRatio(
                  aspectRatio: 1 / 1,
                  child: Container(
                    width: double.infinity,
                    height: double.infinity,
                    child: CachedNetworkImage(
                      imageUrl: channel.img!,
                      fit: BoxFit.fill,
                    ),
                  ),
                ),
                Positioned(
                    top: ScreenUtil().setHeight(15),
                    left: ScreenUtil().setWidth(10),
                    child: Column(
                      children: [
                        Text(
                          channel.title!,
                          style: TextStyle(fontSize: 11),
                        ),
                        Text(
                          channel.desc!,
                          style: TextStyle(fontSize: 10),
                        ),
                      ],
                    ))
              ],
            ),
          ),
        );
      },
      itemCount: dataList.length,
    );
  }
}
